<template>
  <div class="home">
     <!-- <input type="text" @change="changeVal">  -->
     <!-- <input type="text" v-model="title"> -->
     <input type="text" :value="title" @input="inputVal">
     <h1>{{title}}</h1>

  </div>
</template>

<script>
// @ is an alias to /src
import myHeader from '../components/myHeader'

export default {
  data() {
    return {
        title:'2202B'
    }
  },
  components: {
    myHeader
  },
  methods: {
    // 输入框的input事件 输入发生变化就会触发
    // changeInput(e){
    //     console.log(e.target.value);

    // }
    // 输入框的change事件 输入框的值发生变化会触发
    changeVal(e){
      console.log(e);
    },
    inputVal(e){
      console.log(e.target.value);
      this.title = e.target.value
    }
  },
}
</script>
